import {toJS} from 'mobx';
import {WeaAlertPage, WeaDialog, WeaSelect, WeaBrowser, WeaInput, WeaAuth} from 'ecCom';
import {Row, Col, Button, Table, Icon, message, Spin} from 'antd';
import _mapValues from 'lodash/mapValues'
import {WeaLocaleProvider} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;

class CoworkAuth extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedRowKeys: [],
      selectedRows: [],
      edit: false,
      id: '',
    }
  }
  
  render() {
    let {list, title, authConditions, loading} = this.props;
    list = list.map((item, idx) => {
      return {...item, key: item.key || item.id || idx};
    })
    let {selectedRowKeys, edit} = this.state;
    return (
      <div className="wea-cowork-scope">
        {loading ?
          <div className="top40"><Spin /></div> :
          <div className="wea-table-edit">
            <Row className="wea-table-edit-title">
              <Col>
                <span>{title}</span>
                <Button type="primary" title={getLabel(91, '删除')} size="small" onClick={this.doDelete}
                        disabled={selectedRowKeys.length == 0}><Icon type="minus"/></Button>
                <Button type="primary" title={getLabel(1421, '新增')} size="small" onClick={this.doAdd}><Icon type="plus"/></Button>
              </Col>
            </Row>
            {list && list.length > 0 ? <Table columns={this.getColumns()} dataSource={list}
                                              rowSelection={this.getRowSelection()} pagination={false}/> :
              (
                <WeaAlertPage icon="icon-coms-blank" paddingTop="40px">
                  <div>{getLabel(83553, '暂无数据')}</div>
                </WeaAlertPage>
              )}
          </div>
        }
        <WeaAuth ref="auth" visible={edit} title={`${title}${getLabel(68, '设置')}`} onOk={this.submit} onCancel={this.back}
                 conditions={authConditions}
        />
      </div>
    );
  }
  
  getColumns = () => {
    let columns = [
      {
        title: getLabel(21956, '对象类型'),
        dataIndex: 'shareName',
        key: 'shareName',
        width: 80,
      }, {
        title: getLabel(106, '对象'),
        dataIndex: 'contentName',
        key: 'contentName',
      }, {
        title: getLabel(683, '安全级别'),
        dataIndex: 'sec',
        key: 'sec',
        width: 80,
        render: (text, record, index) => {
          if (!record) return '';
          if (record.seclevel) {
            return `${record.seclevel}-${record.seclevelMax}`
          } else {
            return record.jobsope;
          }
        }
      },
    ];
    return columns;
  }
  getRowSelection = () => {
    const {selectedRowKeys} = this.state;
    let rowSelection = {
      selectedRowKeys,
      onChange: (sRowKeys, selectedRows) => {
        this.setState({selectedRowKeys: sRowKeys, selectedRows: selectedRows});
        typeof this.props.onRowSelect === 'function' && this.props.onRowSelect(sRowKeys, selectedRows);
      },
      getCheckboxProps: (record) => {
        return {disabled: record.op_isCanEdit == 0}
      },
    }
    return rowSelection;
  }
  doAdd = () => {
    this.setState({
      edit: true
    });
  }
  
  doDelete = () => {
    let {selectedRows} = this.state;
    if (!selectedRows || selectedRows.length == 0) {
      message.info(getLabel(4904, '请选择要删除的行','note'));
      return;
    }
    this.props.delete && this.props.delete(selectedRows, () => {
      this.setState({
        selectedRowKeys: [],
        selectedRows: [],
      });
    });
  }
  
  submit = () => {
    let datas = this.refs.auth.state.datas;
    let params = _mapValues(datas, (v) => {
      return v || '';
    });
    if (this.props.itemsVO && datas) {
      params.id  = this.props.itemsVO ? this.props.itemsVO.id : '';
    } else if (this.props.id && datas) {
      params.coTypeId = this.props.id ? this.props.id : '';
      params.setType = this.props.id ? this.props.type : '';
    }
    this.props.submit(params, () => {
      this.back();
    });
  }
  
  back = () => {
    this.setState({
      edit: false
    });
  }
}

export default CoworkAuth;